<template>
  <view class="ss-flex ss-col-center notice-wrap">
    <image class="icon-img" :src="sheep.$url.cdn(data.iconUrl)" mode="heightFix"></image>
    <!-- todo：@owen 暂时只支持一个公告   -->
    <l-notice-bar style="flex: 1" :showIcon="false" scrollable single :text="data.contents[0].text" :speed="50"
      :color="data.textColor" @tap="sheep.$router.go(data.contents[0].url)" />
    <view class="right ss-flex" v-if="villageName" @click="openMore">
      <image class="head-img"
        :src="sheep.$url.cdn('https://txtdev-1252097407.cos.ap-guangzhou.myqcloud.com/static/img/shop/goods/location.png')"
        mode="aspectFill" />
      <text class="ss-m-l-10 address">{{villageName}}</text>
    </view>
  </view>
</template>

<script setup>
  /**
   * 装修组件  - 通知栏
   *
   */
  import sheep from '@/sheep';
  import AreaApi from '@/sheep/api/system/area';
  import {
    ref,
    onMounted,
    computed,
    reactive
  } from 'vue'
  import {
    onLoad
  } from '@dcloudio/uni-app';
  let villageName = ref('')
  let villageId = ref(null)
  // 经纬度
  let jwData = reactive({
    latitude: '',
    longitude: ''
  })

  // // 获取当前经纬度
  // const getLatLong = async () => {
  //   return new Promise((reslove, rej) => {
  //     let latitude = uni.getStorageSync('user_latitude');
  //     let longitude = uni.getStorageSync('user_longitude');
  //     if (latitude && longitude) {
  //       reslove({
  //         latitude,
  //         longitude
  //       })
  //     } else {
  //       uni.getLocation({
  //         type: 'wgs84',
  //         success: (res) => {
  //           uni.setStorageSync('user_latitude', res.latitude);
  //           uni.setStorageSync('user_longitude', res.longitude);
  //           reslove({
  //             latitude: res.latitude,
  //             longitude: res.longitude
  //           })
  //         },
  //         fail: function(e) {
  //           console.log(e)
  //         }
  //       })
  //     }
  //   })
  // }
  const props = defineProps({
    data: {
      type: Object,
      default () {},
    },
  });
  const isLogin = computed(() => sheep.$store('user').isLogin);
  const openMore = () => {
    if (!isLogin.value) return
    sheep.$router.go(`/pages/village/index?opt=${JSON.stringify(jwData)}&id=${villageId.value}`)
  }
  // #ifndef MP-WEIXIN
  onLoad(async () => {
          // #endif
          // #ifdef MP-WEIXIN
          onMounted(async () => {
            // #endif
            uni.$on('updateVillage', (data) => {
              if (data) {
                villageName.value = data.villageName
                villageId.value = data.villageId
                return
              }
            })
            // let result = await AreaApi.getVillage()
            // if (result.code == 0 && result?.data) {
            //   villageName.value = result.data.name
            //   villageId.value = result.data.id
            // }
            // let res = await getLatLong()
            // jwData.latitude = res.latitude
            // jwData.longitude = res.longitude
            if (isLogin.value) {
              // 根据经纬度获取小区列表
              // let result = await AreaApi.getVillageList(res)
              // if (result.code == 0 && result?.data?.length) {
              //   villageName.value = result.data[0].name
              //   villageId.value = result.data[0].id
              // }
            }
          })
</script>

<style lang="scss" scoped>
  .notice-wrap {
    .icon-img {
      height: 56rpx;
    }
  }

  .right {
    border: 1px solid #e6e6e6;
    border-radius: 32rpx;
    padding: 4rpx 24rpx;
    font-size: 26rpx;

    image {
      width: 30rpx;
      height: 40rpx;
      margin-right: 6rpx;
    }
  }
</style>